<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
        <link rel="stylesheet" type="text/css" href="./js/dijit/themes/tundra/tundra.css"/>
        <style type="text/css">
            #container {
                border: 1px solid green;
                width: 960px;
                height: 600px;
            }
            
            .bar3 {
                background-color: #fff79e;
                width: 17px;
                height: 30px;
                position: absolute;
                top: 144px;
                left: 70px;
            }
        </style>
    </head>
    <body class="tundra">
        <div id="container">
            <div>
                <button type="button" dojoType="dijit.form.Button" id="btn">
                    button
                </button>
            </div>
            <div id="forParserBefore">
                <button type="button" dojoType="dijit.form.Button" id="btnII">
                    buttonII
                </button>
            </div>
            <span id="bar3" class="bar3"></span>
        </div>
        <div id="externalContainer">
            <div dojoType="dijit.Tooltip" connectId="btn" position="below">
                a<i>disposition</i>
                to bear injuries patiently :<b>forbearance</b>
            </div>
        </div>
    </body>
</html>
<script src="./js/dojo/dojo.js">
</script>
<script type="text/javascript">
    
    dojo.require('dijit.form.Button');
    dojo.require("dijit.Tooltip");
    
    dojo.ready(function(){
        console.log('here');
        new dijit.Tooltip({
            connectId: ["btnII"],
            label: 'this is message from tooltip',
        });
        
        
        /*
         var ptip = dojo.create('p');
         ptip.innerHTML = "TIP";
         
         var node = tip.domNode;
         node.appendChild(ptip);
         console.log(tip.domNode);
         console.log(node);
         dojo.place(tip.domNode, 'externalContainer', 'first');
         */
		/*
		 * @notice
		 * connectId is a widget id ...
		 */
		dojo.parser.parse('forParserBefore') ;
        new dijit.Tooltip({
            connectId: ["btnII"],
            label: "value <b>30</b>",
			position:'above'
        });
    });
    
    dojo.ready(function(){
        /*
         * it's the best to perform the parse time, in case we'll manipulate the dom before doc ready
         */
        dojo.parser.parse();
    });
</script>
